Often we use some attributes such as href, link, src etc. which specify the location of other documents that need to be imported to the HTML document. Generally, these attributes define the location and file path of the other document. If the other document resides in the same location where the HTML document is, then we just specify the document name else we specify path location from the HTML document.
Example
| File Path | Description |
| <img src ="image.jpg"> | image.jpg is at same folder where the HTML file is present. |
| <img src ="images/image.jpg"> | image.jpg is present in the images folder where the current HTML file present. |
| <img src="C:\Users\xyz\Pictures\Saved Pictures\ image.jpg"> | image.jpg is located at C:\Users\xyz\Pictures\Saved Pictures location in the system. |
| <img src="techgeekbuzz.com/images/image.jpg"> | image.jpg is located at the server of techgeekbuzz.com images. |
File Path
Mentioning the correct file path is very important. When we design a web-page, we mostly use the external CSS and JavaScript and then using the <link href> and <style src> import those files on the web page and in the href and src values, we need to specify the correct file path or location of the external documents. Using the file path we can externally link following documents.
- Web Pages
- Style Sheet document.
- JavaScript document
- Images
Type of File Paths
There are generally two types of file paths:
- Absolute File Path
- Relative File Path
Absolute File Path
In the absolute file path, we specify the URL of the external document. For instance, if we want to import an image, CSS or JavaScript code from another website or server.
Example
<img src="https://secureservercdn.net/160.153.137.163/84g.4be.myftpupload.com/wp-content/uploads/2019/03/Techgeekbuzz.png" alt="techgeekbuzz logo">
Relative Path
In the Relative path, the HTML document and external document reside in the same system or server so that a direct path can be specified.
Example
<img src="D:\pictures\Techgeekbuzz.png"
alt="techgeekbuzz logo">
Summary
- File path specifies the location of the external document.
- Images, external, CSS, and JavaScript are external documents that can be imported in the HTML document.
- The file name should be specified along with its extension.
- If the external file present in the same folder where the HTML document is then we only need to specify the file name and its extension.
- In an absolute file path, we specify the file URL present at another server.
- In the relative path, the external and HTML document present in the same system.